<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>用户列表</title>
	<link rel="stylesheet" href="../static/css/css.css">
	<script type="text/javascript" src="../static/js/jquery-1.8.2.min.js"></script>
</head>
<body>

	<h1 id="content"></h1>

	<div style="text-align: center">
		<form action="list">
			<input type="text" id="username" name="username" th:value="${username}" placeholder="用户名">
			<input type="button" onclick="$('#username').val('')" value="重置">
			<input type="submit" value="查询">
		</form>
	</div>
	<div style="text-align:left; float: left">
		<button th:onclick="location = 'toEdit?id=0'">添加</button>
	</div>
	<div style="text-align:right; float: right">
		<button th:onclick="location = '/login/loginout'">登出</button>
	</div>

	<table>
		<thead>
			<tr>
				<th>编号</th>
				<th>用户名</th>
				<th>密码</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody>
			<tr th:each="user : ${list}">
				<td th:text="${user.id}"></td>
				<td th:text="${user.username}"></td>
				<td th:text="${user.password}"></td>
				<td>
					<button th:onclick="location = 'delete?id=[[${user.id}]]' ">删除</button>
					<button th:onclick="location = 'toEdit?id=[[${user.id}]]' ">编辑</button>
				</td>
			</tr>
		</tbody>
	</table>
</body>
<script type="text/javascript">
	$(function() {
		// 标题
		$("#content").html("用户列表");
	})
</script>
</html>